<template>
	<view class="content" v-if="visitorInfo.shop_name">
		 <view>
		
		   <view class="cu-form-group">
				<view class="title light">小区名称</view>
				<view class="picker">
						{{visitorInfo.shop_name}}
				</view>
				
			</view>
			
			 <view class="cu-form-group">
				<view class="title light">业主名称</view>
				<view class="picker">
						{{visitorInfo.nickname}}
				</view>
				
			</view>
			
			
			 <view class="cu-form-group">
				<view class="title light">业主手机号</view>
				<view class="picker">
						{{visitorInfo.owner_phone}}
				</view>
			
			</view>
			
			<view class="cu-form-group">
				<view class="title light">访客姓名</view>
				<view class="picker">
						{{visitorInfo.name}}
				</view>
				
			</view>
			
			<view class="cu-form-group">
				<view class="title light">手机号码</view>
				<view class="picker">
						{{visitorInfo.phone}}
				</view>
				
			</view>
			
		  <view class="cu-form-group">
				<view class="title light">到访人数</view>
				 
					<view class="picker">
						{{visitorInfo.number_of_people}}人
					</view>
				 
			</view>
			
			<view class="cu-form-group">
				<view class="title light">到访日期</view>
				 
					<view class="picker">
						{{visitorInfo.visit_date }}
					</view>
				 
			</view>
			
			<!-- !!!!! placeholder 在ios表现有偏移 建议使用 第一种样式 -->
			<view class="cu-form-group">
				<textarea maxlength="-1" disabled :value="visitorInfo.visit_reason" ></textarea>
			</view>
		
		  <view class="box margin-top-20" style=" padding: 20upx;" v-if="visitorInfo.status==0">
			 
				
			 <button @click="QRCode" v-if="visitorInfo.owner_user_id == user_info.user_id" class="cu-btn block bg-blue margin-tb-sm lg">
				<text :class="loadding==1?'cuIcon-loading2 cuIconfont-spin':'cuIconfont-spin'"></text>查看通行二维码</button>
			 
			 <button @click="updateStatus" v-else class="cu-btn block bg-blue margin-tb-sm lg">
				<text :class="loadding==1?'cuIcon-loading2 cuIconfont-spin':'cuIconfont-spin'"></text>确认放行</button>
			 
			 
			   <button @click="deleteInfo" class="cu-btn block bg-grey margin-tb-sm lg">
				<text :class="loadding1==1?'cuIcon-loading2 cuIconfont-spin':'cuIconfont-spin'"></text>删除</button>
			 
			 
			</view>
			
			 <view class="box margin-top-20" style=" padding: 20upx;" v-else> <button class="cu-btn block bg-grey margin-tb-sm lg">
				<text class="cuIconfont-spin"></text>{{visitorInfo.statusText}}</button>
			</view>
			
		 </view>
	</view>
</template>

<script>
	import beeApp from '../../beeApp.js'
	
	export default {
		data() {
			return {
				 
				visitorInfo:{
					community:{
						
					}
				},
				user_info:{
					
				},
				id:0,
				loadding:0,
				loadding1:0,
			}
		},
		onLoad(option) {
			this.id = option.id;
          // beeApp.alert("yiqwyei");
		  if(beeApp.data.qrCode){
			  var parm = beeApp.GetRequest(beeApp.data.qrCode)
			  this.id = parm.id;
		  }
		  
		  this.getVisitorfo();
		   beeApp.getUserInfo((userInfo)=>{
			  this.user_info = userInfo;
		  })
		},
		methods: {
			 
			   getVisitorfo:function(){
                    var that = this;
                    beeApp.api("api/community_visitor/find",{
                        id:this.id,
                    },function(res){
                         if(res.code==200){
							 res.data.number_of_people = Number(res.data.number_of_people)+1;
                             that.visitorInfo = res.data;
                         }
                        
                    });
                },
				QRCode:function(){
						uni.navigateTo({
							url:"/pages/visitor/QRCode?id="+this.id+"&store_id="+this.visitorInfo.store_id
						})
				},
				
				updateStatus:function(){
					var that = this;
						uni.showModal({
						title: '提示',
						content: '确认放行吗？',
						success: function (res) {
							if (res.confirm) {
								that.postForm();
							} else if (res.cancel) {
								 
							}
						}
					});
				},
				deleteInfo:function(){
					var that = this;
						uni.showModal({
						title: '提示',
						content: '确认删除吗？',
						success: function (res) {
							if (res.confirm) {
								that.doDeleteForm();
							} else if (res.cancel) {
								 
							}
						}
					});
				},
				doDeleteForm:function(){
				  var that = this;
				  if(that.loadding1==1){
					  return;
				  }
				  that.loadding1 =1;
				  beeApp.api("api/community_visitor/del",{
					  id:this.id,
					  method:"POST",
				  },function(res){
					  that.loadding1 =0;
					 if(res.code!=200){
						beeApp.alert(res.msg);
						return ;
					 }
					 beeApp.setPageData("pages/visitor/index",{reload:1});
					beeApp.alert("删除成功！");
					uni.navigateBack()
				  });
				},
				postForm:function(){
				  var that = this;
				  if(that.loadding==1){
					  return;
				  }
				  that.loadding =1;
				  beeApp.api("api/community_visitor/updateStatus",{
					  id:this.id,
					  method:"POST",
				  },function(res){
					  that.loadding =0;
					 if(res.code!=200){
						beeApp.alert(res.msg);
						return ;
					 }
					beeApp.alert("操作成功！");
					that.getVisitorfo();
				  });
				},
	}
		
}
</script>
